import React from 'react'

import './style.scss'

class LoginComponent extends React.Component{
    constructor(props, context){
        super(props, context)
        this.state={
            phone: ''
        }
    }
    render() {
        return (
            <div className="login-box">
                 <div className="container phone-container">
                    <i className="icon iconfont icon-icon-test5"></i>
                    <input type="text"
                            placeholder="请输入手机号"
                            onChange={this.changeHandle.bind(this)}
                            value={this.state.phone}/>
                 </div>
                 <div className="container code-container">
                    <i className="icon iconfont icon-icon-test"></i>
                    <input type="text"
                            placeholder="请输入验证码"/>
                    <button>发送验证码</button>
                 </div>
                 <button className="btn" onClick={this.clickHandle.bind(this)}>登录</button>
            </div>
        )
    }
    componentDidMount() {

    }

    changeHandle(e) {
        this.setState({
            phone: e.target.value
        })
    }

    clickHandle() {
        const userName = this.state.phone
        const loginHandel = this.props.loginHandle
        loginHandel(userName)
    }
}

export default LoginComponent